
(function(window, document, $, undefined ){
var $canvas;

//Fold/Unfolding menu
var foldMenu = function(){
	$('#menu li').mouseenter(function(){
		$(this).animate({
		    'padding-top': '19px'
		  }, 300);

	}).mouseleave(function(){
		$(this).animate({
		    'padding-top': '0'
		 }, 300);
		
	}).click(function(e){
		$(this).toggleClass('active');
		e.preventDefault();
		navFilter();
	});
};
//Filter: Show elements on canvas depends on activeted menu 
var navFilter = function(){
	$itensmenu = $('#menu li');
	
	$itensmenu.not('.active').each(function(){
		var classe = $(this).attr('class');
		classe = classe.replace(' active','');
		classe = '.'+classe;
		$canvas.find(classe).fadeOut('slow');
	});	
	
	$('#menu li.active').each(function(){
		var classe = $(this).attr('class');
		classe = classe.replace(' active','');
		classe = '.'+classe;
		$canvas.find(classe).fadeIn('slow');
	});	
};
//Object - create elements
var collectionCol = {
	create: function(colId, colNom, colDate, OeuvId, fichier, pensee, type, newobj){	

		//mouseX = mouseX || 0; 			mouseY = mouseY || 0;			
	
		var classes =  'work oeuvres '+ pensee + ' ' + type;
			
		//create element
		var oWork = document.createElement('div');
		oWork.setAttribute('id',id);		
		oWork.setAttribute('class', classes);
		document.getElementById('canvas').appendChild(oWork);
		collection.position(oWork, mouseX, mouseY, newobj);
		collection.addInfo(oWork, url);	
		

	},
	position: function(oWork, mouseX, mouseY, newobj){ 
		mouseX = mouseX || 0;
		mouseY = mouseY || 0;
		oWork = $(oWork);
		
		mouseY = mouseY+"px";
		mouseX = mouseX+"px";

		oWork.css({top:mouseY, left:mouseX});

		//animation and callBack
		oWork.fadeIn('slow',function(){
			setCanvas.disable();
			if(newobj){
				mouseY = parseInt(mouseY);
				mouseX = parseInt(mouseX)
				uploadObject(mouseX, mouseY);
			}
		});


	},
	addInfo: function(oWork, url){
		oWork = $(oWork);		
		var html = '<div class="info"><img src="../../oeuvres/vignettes/'+ url +'"></div>';
		oWork.append(html);
	},
	toggleInfo: function(){
		var $work = $('.work'),
			$info = $('.info');				
		
		//show/hide vignette
		$work.mouseenter(function(){
			$(this).find($info).fadeIn();
		}).mouseleave(function(){
			$(this).find($info).fadeOut();
		});	
				
	},
	save: function(mouseX, mouseY){	
		var isPositionAllowed = true,
		oCollection = $('.work');

		/*
			verify if there is already an object in the same position
			@todo : calculate object area and safety area;
			1. True: send a error message;
			2. False: positioning 
		*/
		
		oCollection.each(function(){
			var posX = parseInt($(this).css('left'),10),
			posY = parseInt($(this).css('top'),10),
			radius = 15;

			if((posX === mouseX) && (posY === mouseY)){
				//@todo MESSAGE: 'sorry, u cant position this object here';
				isPositionAllowed = false;
			}
		});			

		//IF #canvas can be edited and this object isn't in the same position as another one THAN create a new object
		if(setCanvas && isPositionAllowed){
			//@todo: get values from popup
			pensee = 'init';
			type = "images";
			id = "";
			url = "";
			
			collection.create(id, mouseX, mouseY, pensee, type, url, true)
		}

	}
};


//Get objects that already exist and create those elements.		
$.getJSON('getData', function(data){
	
	$.each(data.collectionCol, function(){
		collectionCol.create(this.collages_id, this.collages_nom, this.collages_date, 
		 this.oeuvres_id, this.oeuvres_fichier, this.pensees_nom, this.types_nom, false);
	});
	collectionCol.toggleInfo();
	
	//Filtre d'elements sur la page
	navFilter();	

});










/*****************
* Document ready *
******************/
$(document).ready(function(){
	$canvas = $('#canvas');
	
	//Comportement du menu
	foldMenu();
	
	$('#btn_search').click(function(){
		//alert('youpi');
	});
	

});

})(this, this.document, jQuery);

//-------------------------AJAX POUR LA RECHERCHE DE COLLAGE----------------------------------------------------------------------------------
window.onload = function () {
	
	//new ajax.Autocompleter("collages_nom", "autocomplete_choices", "fabrique/ajaxsearch", {});
	
	$('function_search_form').onsubmit = function () {
		//alert('ok');
		inline_results();
		return false;	
	}	
	

}

function inline_results() {
	new Ajax.Updater ('function_description', 'fabrique/ajaxsearch', {method:'post', postBody:'collages_date=true&collages_nom='+$F('collages_nom')});
	new Effect.Appear('function_description');

}



